import {colorTo} from './color.js'
/**
* 获取小程序二维码参数
* @param {String} scene 需要转换的参数字符串
*/
export 	function getQRcodeQuery(url, name) {
			var reg = new RegExp('(^|&|/?)' + name + '=([^&|/?]*)(&|/?|$)', 'i');
			var r = url.substr(1).match(reg);
			if (r != null) {
				return r[2];
			}
			return null;
		}
export default class CanvasJs {
	constructor(node, _this) {
		this.node = node
		this.ctx = uni.createCanvasContext(node, _this)
	}
	/**
	 * 像素单位转rpx
	 * @param num 像素值
	 */
	unitToRpx(num) {
		let rpx = uni.getSystemInfoSync().windowWidth / 750;
		return parseInt(num) * rpx
	}
	/**
	 * 画二维码方法
	 * @param {Object} modules 二维码数组
	 * @param {string} backgroundColor 背景色
	 * @param {string} foregroundColor 二维码色块颜色
	 * @param {number} xx 横轴坐标
	 * @param {number} yy 纵轴坐标
	 * @param {number} size 二维码色块大小
	 * @param {number} margin 二维码色块边距
	 */
	drawQRcode(modules, backgroundColor, foregroundColor, xx, yy, size, margin) {
		xx = this.unitToRpx(xx)
		yy = this.unitToRpx(yy)
		size = this.unitToRpx(size)
		size = this.unitToRpx(size)
		let tileSize = (size - margin * 2) / modules.length;
		this.ctx.setFillStyle(backgroundColor);
		this.ctx.fillRect(this.unitToRpx(xx), this.unitToRpx(yy), size, size);
		for (var row = 0; row < modules.length; row++) {
			for (var col = 0; col < modules.length; col++) {
				// 计算每一个小块的位置
				var x = col * tileSize + margin;
				var y = row * tileSize + margin;
				var w = tileSize;
				var h = tileSize;
				var style = modules[row][col] ? foregroundColor : backgroundColor;
				this.ctx.setFillStyle(style);
				this.ctx.fillRect(x + this.unitToRpx(xx), y + this.unitToRpx(yy), w, h);
			}
		}
	}
	/**
	 * 绘制图片
	 * @param {string} path 图片路径 网络路径
	 * @param {string} left 横轴坐标
	 * @param {string} top 纵轴坐标
	 * @param {number} w 绘制图片宽度
	 * @param {number} h 绘制图片高度
	 */
	async drawImage(path, left, top, w, h, imgLeft = 0, imgTop = 0, imgW, imgH) {
		// this.ctx.save();
		// let imgUrl = null
		// if (path.includes('http')) {
		// 	let [err, res] = await uni.getImageInfo({
		// 		src: path
		// 	})
		// 	imgUrl = res.path
		// } else {
		// 	imgUrl = path
		// }
		if (imgW && imgH) {

			this.ctx.drawImage(path, this.unitToRpx(left), this.unitToRpx(top), this.unitToRpx(w), this.unitToRpx(
				h), this.unitToRpx(imgLeft), this.unitToRpx(imgTop), this.unitToRpx(
				imgW), this.unitToRpx(imgH))
		} else {
			this.ctx.drawImage(path, this.unitToRpx(left), this.unitToRpx(top), this.unitToRpx(w), this.unitToRpx(
				h))
		}
		// this.ctx.restore();
	}
	/**
	 * 绘制图片
	 * @param {string} path 图片路径 网络路径
	 * @param {string} left 横轴坐标
	 * @param {string} top 纵轴坐标
	 * @param {number} w 绘制图片宽度
	 * @param {number} h 绘制图片高度
	 */
	async drawRadiusImage(path, xx, yy, ww, hh, r = 1, c = '#fff') {
		let x = this.unitToRpx(xx)
		let y = this.unitToRpx(yy)
		let w = this.unitToRpx(ww)
		let h = this.unitToRpx(hh)
		r = this.unitToRpx(r)
		this.ctx.save();
		if (w < 2 * r) {
			r = w / 2;
		}
		if (h < 2 * r) {
			r = h / 2;
		}
		this.ctx.beginPath();
		this.ctx.fillStyle = c;

		this.ctx.arc(x + r, y + r, r, Math.PI, Math.PI * 1.5);
		this.ctx.moveTo(x + r, y);
		this.ctx.lineTo(x + w - r, y);
		this.ctx.lineTo(x + w, y + r);

		this.ctx.arc(x + w - r, y + r, r, Math.PI * 1.5, Math.PI * 2);
		this.ctx.lineTo(x + w, y + h - r);
		this.ctx.lineTo(x + w - r, y + h);

		this.ctx.arc(x + w - r, y + h - r, r, 0, Math.PI * 0.5);
		this.ctx.lineTo(x + r, y + h);
		this.ctx.lineTo(x, y + h - r);

		this.ctx.arc(x + r, y + h - r, r, Math.PI * 0.5, Math.PI);
		this.ctx.lineTo(x, y + r);
		this.ctx.lineTo(x + r, y);

		this.ctx.fill();
		this.ctx.clip();
		this.drawImage(path, xx, yy, ww, hh)
		this.ctx.closePath();
		this.ctx.restore();
	}
	roundRect1(x, y, w, h, c = '#fff', r) {
		x = this.unitToRpx(x)
		y = this.unitToRpx(y)
		w = this.unitToRpx(w)
		h = this.unitToRpx(h)
		r = this.unitToRpx(r)
		var min_size = Math.min(w, h);
		if (r > min_size / 2) r = min_size / 2;
		// 开始绘制
		this.ctx.fillStyle = c;
		let ctx = this.ctx
		ctx.beginPath();
		ctx.moveTo(x + r, y);
		ctx.arcTo(x + w, y, x + w, y + h, r);
		ctx.arcTo(x + w, y + h, x, y + h, r);
		ctx.arcTo(x, y + h, x, y, r);
		ctx.arcTo(x, y, x + w, y, r);
		ctx.closePath();
		return ctx;
	}

	/*
	 *  参数说明
	 *  ctx Canvas实例
	 *  img 图片地址
	 *   x  x轴坐标
	 *   y  y轴坐标
	 *   w  宽度
	 *   h  高度
	 *   r  弧度大小
	 */
	circleImgTwo(img, x, y, w, h, r = 1) {
		x = this.unitToRpx(x)
		y = this.unitToRpx(y)
		w = this.unitToRpx(w)
		h = this.unitToRpx(h)
		r = this.unitToRpx(r)
		let ctx = this.ctx
		ctx.save();
		if (w < 2 * r) r = w / 2;
		if (h < 2 * r) r = h / 2;
		ctx.beginPath();
		ctx.moveTo(x + r, y);
		ctx.arcTo(x + w, y, x + w, y + h, r);
		ctx.arcTo(x + w, y + h, x, y + h, r);
		ctx.arcTo(x, y + h, x, y, r);
		ctx.arcTo(x, y, x + w, y, r);
		ctx.closePath();
		ctx.strokeStyle = '#ccc'; // 设置绘制圆形边框的颜色
		ctx.stroke();
		ctx.clip();
		let rpx = uni.getSystemInfoSync().windowWidth / 750;
		this.drawImage(img, x / rpx, y / rpx, w / rpx, h / rpx);
		ctx.restore();
	}
	/**
	 * 绘制文字方法
	 * @param {string} str 要绘制的文字
	 * @param {number} leftWidth 横轴坐标
	 * @param {number} initHeight 纵轴坐标
	 * @param {number} titleHeight 文字高度
	 * @param {number} canvasWidth 设置换行宽度
	 * @param {number} fontZize 设置文字大小
	 * @param {number} color 设置文字颜色
	 */
	drawText(str, leftWidth, initHeight, titleHeight, canvasWidth, fontZize = 12, color = "#333") {
		if (!str) return console.warn('要绘制的文字不能为空！')
		color = colorTo(color,'#')
		leftWidth = this.unitToRpx(leftWidth)
		initHeight = this.unitToRpx(initHeight)
		titleHeight = this.unitToRpx(titleHeight)
		canvasWidth = this.unitToRpx(canvasWidth)
		fontZize = this.unitToRpx(fontZize)
		let lineWidth = 0;
		let lastSubStrIndex = 0; //每次开始截取的字符串的索引
		for (let i = 0; i < str.length; i++) {
			lineWidth += this.ctx.measureText(str[i]).width;
			if (lineWidth > canvasWidth) {
				this.ctx.setFontSize(fontZize);
				this.ctx.setFillStyle(color);
				this.ctx.fillText(str.substring(lastSubStrIndex, i), leftWidth, initHeight); //绘制截取部分
				initHeight += titleHeight;
				lineWidth = 0;
				lastSubStrIndex = i;

			}
			if (i == str.length - 1) {

				//绘制剩余部分
				this.ctx.setFontSize(fontZize);
				this.ctx.setFillStyle(color);
				this.ctx.fillText(str.substring(lastSubStrIndex, i + 1), leftWidth, initHeight);
			}
		}
		// 标题border-bottom 线距顶部距离

	}
	/**
	 * 绘制背景色方法
	 * 
	 * @param {number} x 横轴坐标
	 * @param {number} y 纵轴坐标
	 * @param {number} w 设置背景色宽度
	 * @param {number} h 设置背景色高度度
	 * @param {number} r 设置边框圆角默认为1 不然可能部分手机会有问题
	 * @param {number} color 设置背景色 默认 #fff
	 */
	roundRect(x, y, w, h, r = 1, c = '#fff') {
		x = this.unitToRpx(x)
		y = this.unitToRpx(y)
		w = this.unitToRpx(w)
		h = this.unitToRpx(h)
		r = this.unitToRpx(r)
		if (w < 2 * r) {
			r = w / 2;
		}
		if (h < 2 * r) {
			r = h / 2;
		}
		this.ctx.beginPath();
		this.ctx.fillStyle = c;

		this.ctx.arc(x + r, y + r, r, Math.PI, Math.PI * 1.5);
		this.ctx.moveTo(x + r, y);
		this.ctx.lineTo(x + w - r, y);
		this.ctx.lineTo(x + w, y + r);

		this.ctx.arc(x + w - r, y + r, r, Math.PI * 1.5, Math.PI * 2);
		this.ctx.lineTo(x + w, y + h - r);
		this.ctx.lineTo(x + w - r, y + h);

		this.ctx.arc(x + w - r, y + h - r, r, 0, Math.PI * 0.5);
		this.ctx.lineTo(x + r, y + h);
		this.ctx.lineTo(x, y + h - r);

		this.ctx.arc(x + r, y + h - r, r, Math.PI * 0.5, Math.PI);
		this.ctx.lineTo(x, y + r);
		this.ctx.lineTo(x + r, y);

		this.ctx.fill();
		this.ctx.closePath();
	}
	/**
	 * 绘制
	 */
	draw(callback) {
		this.ctx.draw(false, () => {
			typeof callback === 'function' && callback()
		})
	}
	/**
	 * canvas 转出图片临时地址
	 */
	canvasToImg(_this) {
		return new Promise((resole, inject) => {
			uni.canvasToTempFilePath({
				canvasId: this.node,
				success: res => {
					resole(res.tempFilePath)
				},
				fail: (err) => {
					inject(err.errMsg)
				}
			}, _this);
		})
	}
}